<template>
	<div class="ant-layout-content content--3MVuk">
		<div class="index--RGrlk">

			<form class="ant-form ant-form-vertical left--1CCEH">
				<div class="ant-row ant-form-item">

					<div class="ant-col ant-form-item-label">
						<label class="ant-form-item-required" title="目标主机">
							目标主机
						</label>
					</div>

					<div class="ant-col ant-form-item-control">
						<div class="ant-form-item-control-input">
							<div class="ant-form-item-control-input-content">
								<div>
									<button class="ant-btn ant-btn-default" type="button">
										<span class="action" role="img" aria-label="plus">
										</span>
										<span>添加目标主机</span>
									</button>
								</div>
							</div>
						</div>
					</div>

				</div>
			</form>

		</div>
	</div>
</template>

<script>
	import {
		VAceEditor
	} from 'vue3-ace-editor';
	import 'ace-builds/src-noconflict/mode-html';
	import 'ace-builds/src-noconflict/theme-chrome';
	import axios from "axios";
	import store from "@/store";
	import {
		message
	} from 'ant-design-vue';


	export default {
		components: {
			VAceEditor,
		},
	}
</script>

<style>
	.content--3MVuk {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding: 24px 24px 0;
		overflow-y: scroll;
	}

	.ant-layout-content {
		flex: auto;
		min-height: 0;
	}

	.index--RGrlK {
		display: flex;
		height: calc(100vh - 218px);
		min-height: 420px;
		background-color: #fff;
		overflow: hidden;
	}

	.index--RGrlK .left--1CCEH {
		padding: 24px;
		width: 60%;
		border-right: 1px solid #dfdfdf;
	}

	.ant-layout,
	.ant-layout * {
		box-sizing: border-box;
	}

	.ant-form {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
		color: rgba(0, 0, 0, .85);
		font-size: 14px;
		font-variant: tabular-nums;
		line-height: 1.5715;
		list-style: none;
		-webkit-font-feature-settings: "tnum", "tnum";
		font-feature-settings: "tnum", "tnum";
	}

	.ant-form-vertical .ant-form-item {
		flex-direction: column;
	}

	.ant-layout,
	.ant-layout * {
		box-sizing: border-box;
	}

	.ant-row,
	.ant-row::after,
	.ant-row::before {
		display: flex;
	}

	.ant-row {
		flex-flow: row wrap;
		flex-direction: row;
	}

	.ant-form-item {
		box-sizing: border-box;
		padding: 0;
		color: rgba(0, 0, 0, .85);
		font-size: 14px;
		font-variant: tabular-nums;
		line-height: 1.5715;
		list-style: none;
		-webkit-font-feature-settings: "tnum", "tnum";
		font-feature-settings: "tnum", "tnum";
		margin: 0 0 24px;
		vertical-align: top;
		transition: margin-bottom .3s linear 17ms;
	}

	.ant-col {
		position: relative;
		max-width: 100%;
		min-height: 1px;
	}

	.ant-form-item-label {
		display: inline-block;
		flex-grow: 0;
		overflow: hidden;
		white-space: nowrap;
		text-align: right;
		vertical-align: middle;
	}

	.ant-form-item-label>label.ant-form-item-required:not(.ant-form-item-required-mark-optional)::before {
		display: inline-block;
		margin-right: 4px;
		color: #ff4d4f;
		font-size: 14px;
		font-family: SimSun, sans-serif;
		line-height: 1;
		content: "*";
	}

	.ant-col {
		position: relative;
		max-width: 100%;
		min-height: 1px;
	}

	.ant-form-item-control {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
	}

	.ant-form-item-control-input {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 32px;
	}

	.ant-form-item-control-input-content {
		flex: auto;
		max-width: 100%;
	}

	.ant-btn {
		line-height: 1.5715;
		position: relative;
		display: inline-block;
		font-weight: 400;
		white-space: nowrap;
		text-align: center;
		background-image: none;
		box-shadow: 0 2px 0 rgba(0, 0, 0, .015);
		transition: all .3s cubic-bezier(.645, .045, .355, 1);
		-webkit-user-select: none;
		user-select: none;
		touch-action: manipulation;
		height: 32px;
		padding: 4px 15px;
		font-size: 14px;
		border-radius: 2px;
		color: #2563fc;
		cursor: pointer;
		color: rgba(0, 0, 0, .85);
		border: 1px solid #d9d9d9;
		background: #fff;
	}

	.anticon {
		display: inline-block;
		color: inherit;
		font-style: normal;
		line-height: 0;
		text-align: center;
		text-transform: none;
		vertical-align: -.125em;
		text-rendering: optimizelegibility;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	.ant-btn {
		float: left;
		line-height: 1.5715;
		position: relative;
		display: inline-block;
		font-weight: 400;
		white-space: nowrap;
		text-align: center;
		background-image: none;
		box-shadow: 0 2px 0 rgba(0, 0, 0, .015);
		transition: all .3s cubic-bezier(.645, .045, .355, 1);
		-webkit-user-select: none;
		user-select: none;
		touch-action: manipulation;
		height: 32px;
		padding: 4px 15px;
		font-size: 14px;
		border-radius: 2px;
		color: #2563fc;
		cursor: pointer;
		color: rgba(0, 0, 0, .85);
		border: 1px solid #d9d9d9;
		background: #fff;
	}
</style>